<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>个性留言板</title>
<!-- 这个是视图文件 -->
<link href="css/index.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript"> 
$(function(){
  
  // 移到留言上可以删除,编辑-------------------------------------------
    $('#mian .list .onep').hover(function() {
      $(this).find('a').show();
      $(this).find('.edit_a').show();
      $(this).find('.content').addClass('content1');
    }, function() {
      $(this).find('a').hide();
      $(this).find('.edit_a').hide();
      $(this).find('.content').removeClass('content1');
    });

   // 留言方式的切换------------------------------------------------
    var c=1;
    $('.close').click(function(event) {
      if(c==1){
        $('#right').stop().animate({"top": 800+'px'},2000).parent().parent().find('#bottom_out').stop().animate({"bottom": 0+'px'},3000);
        c=0;
      }else{
        $('#right').stop().animate({"top": 50+'px'},2000).parent().parent().find('#bottom_out').stop().animate({"bottom": -120+'px'},3000);
        c=1;
      }
    });

  
  
})


</script>

</head>

<body>

<div id="top">
    <h1>个性留言板</h1>
</div>
<div id="mian_out">
    <div id="mian">
      <h2>一共有<?php echo $num;?>条留言</h2>
      <form style="text-align: right;margin-bottom: 20px;" action="" method="get">
          <span style="font-size: 14px; color: #999;">请输入搜索关键字：</span> <input type="text" name="search" value="<?php echo $search;?>" />
          <input type="submit" value="搜索" class="btn"/> 
      </form>
      <ul class="list">
                        <?php 
                        foreach($bbsdata as $v)
                        {
                        ?>
                            <li class="onep">
                                <p class="pic"><img src="<?php echo $v['imgurl'] ?>" alt="" /></p>
                                <p class="name"><?php echo $v['username']?></p>
                                <p class="content">
                                <?php 
                                if ($v['sex']=='男')
                                  echo "他说：";
                                else
                                  echo "她说：";
                                ?>


                                <?php echo $v['message']?> <?php echo $v['m_date']?>
                                <span> (来自火星"<?php echo $v['sex'] ?>侠"的留言)</span>
                                </p>
                                <a class="edit_a" href="bbsupdate.php?id=<?php echo $v['id']?>">修改</a>
                                <a class="delete" href="javascript:" onclick="if(confirm('确定删除吗？')) location.href='bbsdel.php?id=<?php echo $v['id']?>'" >删除</a>
                            </li>
                        <?php
                        }
                        ?>
      </ul>
      <?php
      if ($page==1)
          $pre=1;
      else
          $pre=$page-1;
      if ($page==$maxpage)
          $next=$maxpage;
      else
          $next=$page+1;
      ?>
      <div id="page">
          <span>当前第<?php echo $page; ?>页/共<?php echo $maxpage; ?>页</span>
          <a href="index.php?page=1&search=<?php echo $search;?>">首页</a>
          <a href="index.php?page=<?php echo $pre; ?>&search=<?php echo $search;?>">上一页</a>
          <a href="index.php?page=<?php echo $next; ?>&search=<?php echo $search;?>">下一页</a>
          <a href="index.php?page=<?php echo $maxpage; ?>&search=<?php echo $search;?>">尾页</a>
      </div>
   </div>
   
   <div id="right">
      <h2>留下你的脚步吧</h2>
      <form action="bbsadd.php" method="post">
        <p class="one">
        昵称:<input class="name" name="username" type="text" placeholder="你的名字" required="required" />
        <input type="radio" name="sex" value="男" checked="checked" />男侠
        <input type="radio" name="sex" value="女" />女侠
        </p>
        <p><textarea name="message" placeholder="这个人很懒,什么都没有写" required="required" ></textarea></p>
        <p class="tow">
          <input type="radio" name="imgurl" value="images/1.jpg" checked="checked" /><img src=" images/1.jpg" alt="" />
          <input type="radio" name="imgurl" value="images/2.jpg" /><img src=" images/2.jpg" alt="" />
          <input type="radio" name="imgurl" value="images/3.jpg" /><img src=" images/3.jpg" alt="" />
          <input type="radio" name="imgurl" value="images/4.jpg" /><img src=" images/4.jpg" alt="" />
        </p>
        <p class="thr"><input class="btn" type="submit" value="提交" /></p>
      </form>
      <div class="close"></div>
</div>
   
</div>

<div id="bottom_out">
    <div id="bottom">
      <form action="bbsadd.php" method="post">
        <p class="one">
        昵称:<input class="name" name="username" type="text" placeholder="大爷你的名字" required="required" />
        <br/><br/>
        <input type="radio" name="sex" value="男" checked="checked" />男侠
        <input type="radio" name="sex" value="女" />女侠
        </p>
        <p><textarea name="message" placeholder="这个人很懒,什么都没有写" required="required"></textarea></p>
        <p class="tow">
          <input type="radio" name="imgurl" value="images/1.jpg" checked="checked" /><img src=" images/1.jpg" alt="" />
          <input type="radio" name="imgurl" value="images/2.jpg" /><img src=" images/2.jpg" alt="" />
          <input type="radio" name="imgurl" value="images/3.jpg" /><img src=" images/3.jpg" alt="" />
          <input type="radio" name="imgurl" value="images/4.jpg" /><img src=" images/4.jpg" alt="" />
        </p>
        <p class="thr"><input class="btn" type="submit" value="提交" /></p>
      </form>
      <div class="close"></div>
    </div>
</div>

</body>
</html>